﻿<!DOCTYPE html>
<html lang="zh-cmn-Hans">

	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0">
		<title>WeUI</title>
		<link rel="stylesheet" href="css/weui.min.css" />
		<link rel="stylesheet" href="css/example.css" />
		<script src="js/jquery-2.1.4.min.js"></script>
	</head>

	<body ontouchstart>
		<div class="weui-toptips weui-toptips_warn js_tooltips">错误提示</div>

		<div class="container" id="container">
			<div class="super-head pr">
				<a class="pa ft16 white" style="left:15px;" href="">取消</a>添加音乐</div>
			<div class="tc">
				<div class="ft16 mt20 mb20 grey2" style="padding-top: 40px;">为他/她添加印象音乐</div>
				<img src="images/music.png" width="125" alt="">
			</div>

			<div class="page__bd" id="formInp">
				<div class="weui-cells">
					<div class="weui-cell">
						<div class="weui-cell__bd">
							<input id="weui_input1" class="weui-input" type="text" placeholder="请添加歌曲名称">
						</div>
					</div>
					<div class="weui-cell">
						<div class="weui-cell__bd">
							<input id="weui_input2" class="weui-input" type="text" placeholder="请添加网易云音乐歌曲分享地址">
						</div>
					</div>
				</div>
				<div class="weui-progress">
					<div class="weui-progress__bar">
						<div class="weui-progress__inner-bar js_progress" style="width: 0%;"></div>
					</div>
					<!-- <a href="javascript:;" class="weui-progress__opr">
                <i class="weui-icon-cancel"></i>
            </a> -->
				</div>
				<!-- <div class="red ft16 ml15">请添加正确的音乐地址</div> -->
				<div class="weui-btn-area">
					<a href="success.html" class="weui-btn weui-btn_primary" id="btnUpload" onclick="submitInfo(this);">确认添加</a>
				</div>
			</div>
		</div>

		<script src="js/zepto.min.js"></script>
		<script type="text/javascript" src="js/jweixin-1.0.0.js"></script>
		<script type="text/javascript">
			$(function() {
				var $progress = $('.js_progress'),
					$btnUpload = $('#btnUpload');
				var progress = 0;

				function next() {
					if(progress > 100) {
						progress = 0;
						$btnUpload.removeClass('weui-btn_disabled');
						return;
					}
					$progress.css({
						width: progress + '%'
					});
					progress = ++progress;
					setTimeout(next, 20);
				}

				$btnUpload.on('click', function() {
					if($btnUpload.hasClass('weui-btn_disabled')) return;

					$btnUpload.addClass('weui-btn_disabled');
					next();
				});
			});
		</script>
		<script type="text/javascript">
			function submitInfo() {
				var musicurl = $('#weui_input1').val();
				var musicname = $('#weui_input2').val();
				var faceid = $('#Face_ID').val();
				$.ajax({
				    url: "http://121.40.48.209:8290/api/v1/mymusiclab/",
					type: "post",
					cache: false,
					data: {
						MusicUrl: musicurl,
						singer: musicname,
						Face_ID: faceid
					},
					dataType: 'json',
					success: function(res) {
						if(res.error_code == 0) {
							$(".sucSubmit").show();
						}

					},
					error: function(res) {

					}
				})
			}
		</script>
		<input type="hidden" name="Face_ID" id="Face_ID" value="420e7dfc1c086856b3aab23da54cee4c">
	</body>

</html>